import React from "react";
import ReactDom from "react-dom";
import {Link} from "react-router-dom";
// 引入公共部分
import AdminHeader from './header.jsx';
import AdminLeft from './left.jsx';
import PageSize from '../pagination/page_size.jsx';
// 引入工具类
import {REQUEST,STORAGE,deleteNoUseKey,checkAdminUser} from "../../util/comm.jsx";
import {adminCommentsUrl} from '../../util/constant.js';
// 实例化
const _request=new REQUEST();
const _storage=new STORAGE();
import { Checkbox,Form,Input,Icon,Button, message } from 'antd';

import Pagination from '../pagination/index.jsx';

class AdminComments extends React.Component{
	constructor(){
		super();
		this.state={
			commentsList:[],
			total:0,
			page:1,
			pageSize:10,
			selectList:[],
			isLoading:false,
			nickName:'',
			updating:false,
			userId:'',
			newsId:'',
			keyword:''
		}
	}
	componentWillMount(){
		checkAdminUser();
	}
	componentDidMount(){
		this.onLoad(this.state.page);
	}
	// 加载新闻列表
	onLoad(page){
		this.getCommentsList(page,this.state.pageSize,this.state.userId,this.state.newsId,this.state.id,this.state.keyword);
	}
	// 请求新闻列表
	getCommentsList(page,pageSize,userId,newsId,id,keyword){
		let param={
			page,
			pageSize,
			userId,
			newsId,
			id,
			keyword
		}
		// 加载中...
		this.setState({
			isLoading:true,
		})
		// 删除无用参数
		deleteNoUseKey(param);
		_request.get(adminCommentsUrl,param).then(res=>res.json()).then(res=>{
			if(res.code==1){
				this.setState({
					commentsList:res.data,
					total:res.total,
					isLoading:false,
					seleclAll:false,
					page
				})
			}
		})
	}

	// 分页改变页码
	onChangePage(index){
		this.onLoad(index);
	}
	// 删除用户
	deleteComments(ids){
		let userId=_storage.getStorage('ReactNews_AdminUserInfo').id,
			param={
				userId:userId,
				commentsIds:ids
			}
		_request.post(adminCommentsUrl,param).then(res=>res.json()).then(res=>{
			if(res.code==1){
				message.success(res.message);
				this.onLoad(this.state.page);
			}
			else{
				message.error(res.message);

			}
		})
	}
	// 选中用户
	setlectComments(id,e){
		if(!id){
			if(e.target.checked){
				let selectList=[];
				for(let i=0,length=this.state.commentsList.length;i<length;i++){
					selectList.push(this.state.commentsList[i].id);
				}
				this.setState({
					selectList,
					seleclAll:true,
				})
			}
			else{
				this.setState({
					selectList:[],
					seleclAll:false
				})	
			}
			return;
		}
		else{
			if(e.target.checked){
				let selectList=this.state.selectList;
					selectList.push(id);
				this.setState({
					selectList
				})
			}
			else{
				let selectList=this.state.selectList;
				let index=selectList.indexOf(id);
				selectList.splice(index,1);
				this.setState({
					selectList
				})
			}

		}
	}
	// 改变分页数量
	changePageSize(value){
		this.setState({
			pageSize:-(0-value),
			page:1,
			commentsList:[]
		},()=>{this.onLoad(1)});
	}
	// 搜索
	search(e){
		e.preventDefault();
		this.props.form.validateFields((error,value)=>{
			if(!error){
				this.setState(value,()=>this.onLoad(1))
			}
			else{
				message.error(error)
			}
		});	
	}

	render(){
		const FormItem = Form.Item;
		const { getFieldDecorator,getFieldValue } = this.props.form;
		return(
			<div className="admin-index">
				<AdminHeader></AdminHeader>
				<div className="main">
					<AdminLeft></AdminLeft>
					{!this.state.updating?
					<div className="main-right">
						<div className="search">
								<Form layout="inline" onSubmit={this.search.bind(this)}>
									<FormItem >
										 {getFieldDecorator('id', {
										  })(
										      <Input prefix={"ID :"} placeholder="请输入用户id" className="a2" />
										  )}
									</FormItem>
									<FormItem >
										 {getFieldDecorator('userId', {
										  })(
										      <Input prefix={"用户ID :"} placeholder="请输入用户ID" className="a4" />
										  )}
									</FormItem>
									<FormItem >
										 {getFieldDecorator('newsId', {
										  })(
										      <Input prefix={"新闻ID :"} placeholder="请输入新闻ID" className="a4"  />
										  )}
									</FormItem>
									<FormItem >
										 {getFieldDecorator('keyword', {
										  })(
										      <Input prefix={"关键词 :"} placeholder="请输入关键词" className="a4"  />
										  )}
									</FormItem>
									<FormItem>
										<Button  type="primary" htmlType="submit">查询</Button>
									</FormItem>
								</Form>

						</div>
						<div className="news">
							{
								!this.state.isLoading?
								<table cellSpacing='0' cellPadding='0'>
									<thead>
										<tr>
											<td className="table-cell comments-select"><Checkbox checked={this.state.seleclAll?true:false} onChange={this.setlectComments.bind(this,0)}></Checkbox></td>
											<td className="table-cell comments-id">ID</td>
											<td className="table-cell comments-userid">用户ID</td>
											<td className="table-cell comments-newsid">新闻ID</td>
											<td className="table-cell comments-content">评论内容</td>
											<td className="table-cell comments-time">评论时间</td>
											<td className="table-cell comments-contdol">删除</td>
										</tr>
									</thead>
									<tbody>
									{
										this.state.commentsList.map((item,index)=>{
										return(
										<tr key={index}>
											<td className="table-cell comments-select"><Checkbox checked={this.state.selectList.indexOf(item.id)!=-1?true:false} onChange={this.setlectComments.bind(this,item.id)}></Checkbox></td>
											<td className="table-cell comments-id">{item.id}</td>
											<td className="table-cell comments-userid">{item.userId}</td>
											<td className="table-cell comments-newsid">{item.newsId}</td>
											<td className="table-cell comments-content">{item.content}</td>
											<td className="table-cell comments-time">{item.createTime}</td>
											<td className="table-cell comments-contdol"><span className="delete" onClick={this.deleteComments.bind(this,item.id)}>删除</span></td>
										</tr>	
											)
										})
									}
									</tbody>

								</table>:
								<div className="loading">加载中...</div>
							}
							{	this.state.total>this.state.pageSize?
								<div className="page">
									<Pagination onChange={this.onChangePage.bind(this)} current={-(0-this.state.page)} total={-(0-this.state.total)} pageSize={this.state.pageSize}
								 		showLessItems />
									<PageSize changePageSize={this.changePageSize.bind(this)}></PageSize>	
								</div>
								:''
							}
							<div className="delete-selected">
								<Button onClick={this.deleteComments.bind(this,this.state.selectList.join(","))}>删除选中</Button>
							</div>
						</div>
					</div>:
					<div className="main-right"><div className="loading">更新中...</div></div>}	
				</div>	
			</div>
		)
	}
}
AdminComments=Form.create({})(AdminComments);

export default AdminComments;

